<template>
  <div class="customer">
    <x-header>联系客服</x-header>
    <box gap="15px">
      <flexbox style="align-items: flex-start; text-align: center">
        <flexbox-item>
          <div class="title">客服热线</div>
          <a href="tel: 021-50120179">021-50120179</a>
          <a href="tel: 50120189">50120189</a>
          <a href="tel: 50890789">50890789</a>
          <a href="tel: 20221791">20221791</a>
          <a href="tel: 20221792">20221792</a>
          <a href="tel: 20221793">20221793</a>
          <a href="tel: 20220108">20220108</a>
        </flexbox-item>
        <flexbox-item>
          <div class="title">QQ客服</div>
          <p>2269799822</p>
          <p>1318950972</p>
          <p>1660036122</p>
          <p>1989225014</p>
          <p>3508253506</p>
          <p>2504005570</p>
          <p>1163622554</p>
          <p>3116482159</p>
          <!--<a href="http://wpa.qq.com/msgrd?v=3&uin=2269799822&site=qq&menu=yes" target="_blank">-->
            <!--<img style="vertical-align: middle" src="../../assets/qq_online.jpg" />客服1-->
          <!--</a>-->
          <!--<a href="tencent://message/?uin=1318950972&site=11&menu=yes" target="_blank">-->
            <!--<img style="vertical-align: middle" src="../../assets/qq_online.jpg" />客服2-->
          <!--</a>-->
          <!--<a href="tencent://message/?uin=1660036122&site=11&menu=yes" target="_blank">-->
            <!--<img style="vertical-align: middle" src="../../assets/qq_online.jpg" />客服3-->
          <!--</a>-->
          <!--<a href="tencent://message/?uin=1989225014&site=11&menu=yes" target="_blank">-->
            <!--<img style="vertical-align: middle" src="../../assets/qq_online.jpg" />客服4-->
          <!--</a>-->
          <!--<a href="tencent://message/?uin=3508253506&site=11&menu=yes" target="_blank">-->
            <!--<img style="vertical-align: middle" src="../../assets/qq_online.jpg" />客服5-->
          <!--</a>-->
          <!--<a href="tencent://message/?uin=2504005570&site=11&menu=yes" target="_blank">-->
            <!--<img style="vertical-align: middle" src="../../assets/qq_online.jpg" />客服6-->
          <!--</a>-->
          <!--<a href="tencent://message/?uin=1163622554&site=11&menu=yes" target="_blank">-->
            <!--<img style="vertical-align: middle" src="../../assets/qq_online.jpg" />客服7-->
          <!--</a>-->
          <!--<a href="tencent://message/?uin=3116482159&site=11&menu=yes" target="_blank">-->
            <!--<img style="vertical-align: middle" src="../../assets/qq_online.jpg" />客服8-->
          <!--</a>-->
        </flexbox-item>
      </flexbox>
    </box>
  </div>
</template>

<script>
import {
  XHeader,
  Flexbox,
  FlexboxItem,
  Box
} from 'vux'
export default {
  name: 'customer',
  components: {
    XHeader,
    Flexbox,
    FlexboxItem,
    Box
  },
  data () {
    return {}
  }
}
</script>

<style lang="less" scoped>
  .customer{
    .title{
      font-weight: bolder;
      margin: 20px 0 10px 0;
    }
    a{
      display: block;
      margin: 5px 0;
    }
  }
</style>
